<template>
	<!--首页->租房->独栋公寓-->
	<!--https://youzan.github.io/vant/#/zh-CN/intro-->
	<div class="apartment">
		<!--头部-->
		<myheader></myheader>

		<!--区域选择-->
		<choice></choice>
		<!--没有数据-->
		<div class="noinfo" v-if="!showlogge">
			<img src="../../../../static/wfy/crying_face.jpg" />
			<h3 class="showtop">您还没有关注的门店</h3>
			<p>去关注门店吧</p>
		</div>
		<!--有数据-->
		<ul class="houseinfo" v-else-if="showlogge">
			<li>
				<router-link to='/lideta/mydetails'>
					<button class="cancel">随时入住</button>
					<div class="bg1">
						<img class="dataimg" src="../../../../static/wfy/house05.jpg" />
						<div class="houselogo">
							<img src="../../../../static/wfy/icon01.png" />
						</div>
					</div>
					<div class="titlebox">
						<h3 class="title1">珠江太阳城</h3>
						<p class="title2">北城路51号</p>
						<div class="title-pic">
							<h3 class="hosepic"> 1250-1600元/月</h3>
							<dl>
								<label class="apartment">5个户型| </label>
								<label class="hosedsingle">170套在租</label>
							</dl>
						</div>
						<div class="flat__coupon"><span class="coupon_style">券</span>7日免租金券</div>
					</div>
				</router-link>
			</li>
			<li>
				<button class="cancel">随时入住</button>
				<router-link to='/lideta/mydetails'>
					<div class="bg1">
						<img class="dataimg" src="../../../../static/wfy/house06.jpg" />
						<div class="houselogo">
							<img src="../../../../static/wfy/icon02.png" />
						</div>
					</div>
					<div class="titlebox">
						<h3 class="title1">珠江太阳城</h3>
						<p class="title2">北城路51号</p>
						<div class="title-pic">
							<h3 class="hosepic"> 1250-1600元/月</h3>
							<dl>
								<label class="apartment">5个户型| </label>
								<label class="hosedsingle">170套在租</label>
							</dl>
						</div>
						<div class="flat__coupon"><span class="coupon_style">券</span>7日免租金券</div>
					</div>
				</router-link>
			</li>
		</ul>
	</div>
</template>
<script>
	import myheader from '@/components/public/myheader'
	import choice from '@/components/public/choice'
	export default {
		name: 'apartment',
		data() {
			return {
				showlogge: true,
				isShow: false,
				imgdata: {
					url: '../../../../static/wfy/house05.jpg',
					url1: '../../../../static/wfy/house06.jpg'
				},
				business: {
					logo: '../../../../static/wfy/icon01.png',
					logo1: '../../../../static/wfy/icon02.png'
				}
			}
		},
		mounted:function() {
			//判读是否登陆了
			if(localStorage.getItem("nameid")==null||localStorage.getItem("nameid")==undefined||localStorage.getItem("nameid")==""){
				this.$router.push({
					name:'login'
				});
			}
			else{
				
			}
		},
		components: {
			myheader,
			choice
		},
		methods: {}
	}
</script>

<style scoped="scoped">
	.noinfo {
		margin-top: 3.1rem;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	
	.showtop {
		width: 100%;
		text-align: center;
		margin-top: 0.85rem;
	}
	
	.noinfo img {
		width: 1.63rem;
		height: 1.63rem;
	}
	
	.noinfo p {
		margin-top: 0.35rem;
		font-size: 0.3rem;
		color: #8f929c;
	}
	
	.houseinfo {
		list-style: none;
	}
	
	.houseinfo li {
		padding: 0.4rem 0.3rem;
		box-sizing: border-box;
		position: relative;
		border-bottom: 1px solid #f2f3f8;
	}
	
	.houseinfo li>a {
		width: 100%;
		height: 100%;
		display: block;
		box-sizing: border-box;
	}
	
	.bg1 {
		width: 100%;
		height: 3.75rem;
		position: relative;
	}
	
	.houseinfo li>a .dataimg {
		width: 100%;
		height: 3.75rem;
	}
	
	.titlebox {
		padding-top: 0.3rem;
	}
	
	.title1 {
		font-size: 0.4rem;
		color: #000000;
		height: 0.5rem;
	}
	
	.title2 {
		font-size: 0.3rem;
		color: #b7b7bc;
		height: 0.4rem;
	}
	
	.title-pic {
		display: flex;
		justify-content: space-between;
		height: 0.6rem;
		line-height: 0.6rem;
	}
	
	.hosepic {
		color: #ff665e;
		font-size: 0.35rem;
	}
	
	.apartment,
	.hosedsingle {
		color: #99a0a6;
		font-size: 0.18rem;
	}
	
	.houseinfo .cancel {
		height: 0.5rem;
		width: 1.35rem;
		text-align: center;
		outline: none;
		border: none;
		background: #fff;
		color: #384053;
		position: absolute;
		left: 0.55rem;
		top: 0.65rem;
		border-radius: 0.05rem;
		font-size: 0.12rem;
		z-index: 666;
	}
	
	.houselogo {
		position: absolute;
		bottom: -0.5rem;
		right: 0.25rem;
		height: 0.9rem;
		width: 0.9rem;
	}
	
	.houselogo>img {
		height: 0.9rem;
		width: 0.9rem;
	}
	
	.bggun {
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, .4);
		z-index: 9998;
	}
	
	.flat__coupon {
		display: inline-block;
		font-size: 0.25rem;
		color: #9399a5;
		height: 0.4rem;
		line-height: 0.45rem;
	}
	
	.coupon_style {
		width: 0.3rem;
		height: 0.33rem;
		display: inline-block;
		background: #f5615b;
		color: #fff;
		font-size: 0.2rem;
		margin-right: 0.2rem;
		line-height: 0.32rem;
		border-radius: 0.05rem;
		text-align: center;
	}
</style>